<!--
 * @Description: 
 * @version: 
 * @Author: wyx
 * @Date: 2020-09-27 20:18:35
 * @LastEditDate: Do not exit
-->
<template>
  <el-card class="card">
    <div class="title">
      <h4>绑定手机</h4>
      <div  style="width:100%;background-color:rgb(240,240,240);height:2px"></div>
    </div>
    <div class="tbody">
        <el-form :model="user" :rules="rules" ref="user">
          <el-form-item label="密码：" label-width="100px" prop="password" >
            <el-input v-model="user.password" type="password"></el-input>
          </el-form-item>
          <el-form-item label="新手机号：" label-width="100px" prop="phone" >
            <el-input v-model="user.phone" type="telephone"></el-input>
          </el-form-item>
          <el-form-item >
            <el-button style="width:100px" type="primary" @click="submit('user')">确定</el-button>
          </el-form-item>
        </el-form>
    </div>
  </el-card>
</template>

<script>
import ShareData from "@/utils/localStorage.js";
import{selectById ,update}from '@/api/member.js'
export default {
data(){
    return{
        user:{password:"",phone:""},
        member:{},
         rules:
            {
                password:[
                    {required:true,message:"请填写正确的密码",trigger: 'blur'}
                ],
                phone:[
                    {required:true,message:"手机号码不能为空",trigger: 'blur'}
                ],
               
            },
       
    }
},
mounted(){},
methods:{
 
  submit(formName){
    this.$refs[formName].validate(valid=>{
      if(valid){
        this.memberId=ShareData.getItem("memberId")
    selectById(this.memberId).then(res=>{
        if(res.data.code==="0000"){
          if(this.user.password!==res.data.data.password){
             this.$message.error("密码不正确")
             
          }else{
            this.member=res.data.data
            this.member.phone=this.user.phone
            this.member.gender=this.member.gender.code
            update(this.member).then(res=>{
              if(res.data.code==="0000"){
                this.$message.success("修改成功")
                ShareData.setItem("phone",this.member.phone)
                this.$router.push("/memberCenter")
              }
            })
          }
          
        }
      })
      }
    })
  }

}
}
</script>

<style lang="scss" scoped>
.card {
  padding: 3%;
  margin-bottom: 15%;
}
.title {
  text-align: left;
  margin-top: -20px;
}
.tbody{
     padding: 3%;
}
.el-form{
    width:30%;
    margin-left:35%
}
.el-input{
    width:250px
}

</style>